<!--
 * @Description: 
 * @Author: MALossov
 * @Date: 2022-02-08 11:01:51
 * @LastEditTime: 2022-02-08 16:08:30
 * @LastEditors: MALossov
 * @Reference: 
-->
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Sign Up & Sign in Page</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css">
    <link rel="stylesheet" href="./log_style.css">
    <link rel="stylesheet" href="./pwd.css">
</head>

<body>
    <div class="container right-panel-active">
        <!-- 注册 -->
        <div class="container_form container--signup">
            <form action="#" class="form" id="form1">
                <h2 class="form_title">Sign Up</h2>
                <input type="text" placeholder="User" class="input" id="UserName_sign" />
                <input type="email" placeholder="Email" class="input" id="Email_sign" />
                <input type="password" placeholder="Password" class="input" id="password_sign" />
                <div class="conceal" id="conceal_sign"></div>
                <p id="SignUpStatus" class="Status">Haven't Request for SignUP.</p>
                <button class="btn" id="SignUpSummit" onclick="SignUP()">Sign Up</button>
            </form>
        </div>

        <!-- 登录 -->
        <div class="container_form container--signin">
            <form action="#" class="form" id="form2">
                <h2 class="form_title">Sign In</h2>
                <input type="email" placeholder="Email" class="input" id="Email_login" />
                <input type="password" placeholder="Password" class="input" id="password_login">
                <div class="conceal" id='conceal_login'></div>

                <a href="./" class="link">Forgot your password?<br>Just retry <strong>SignUP!</strong></a>

                <p id="SignInStatus" class="Status">Haven't Request for SignIN.</p>
                <button class="btn" id="SignInSummit" onclick="SignIN()">Sign In</button>
            </form>
        </div>

        <!-- 浮层 -->
        <div class="container_overlay">
            <div class="overlay">
                <div class="overlay_panel overlay--left">
                    <button class="btn" id="signIn">Sign In</button>
                </div>
                <div class="overlay_panel overlay--right">
                    <button class="btn" id="signUp">Sign Up</button>
                </div>
            </div>
        </div>
    </div>

    <!-- 背景 -->
    <div class="slidershow">
        <div class="slidershow--image" style="background-image: url('https://source.unsplash.com/Snqdjm71Y5s')"></div>
        <div class="slidershow--image" style="background-image: url('https://source.unsplash.com/5APj-fzKE-k')"></div>
        <div class="slidershow--image" style="background-image: url('https://source.unsplash.com/wnbBH_CGOYQ')"></div>
        <div class="slidershow--image" style="background-image: url('https://source.unsplash.com/OkTfw7fXLPk')"></div>
    </div>

    <!-- partial -->
    <script src="./log_script.js"></script>
    <script src="./pwd.js"></script>
    <script src="./log_summit.js"></script>
</body>

</html>